<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Linux Appliance Box &beta;</title>
    <link type="text/css" href="css/smoothness/jquery-ui.css" rel="stylesheet" />    
    <link type="text/css" href="css/main.css" rel="stylesheet"/>
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery-ui.min.js"></script>
    <script type="text/javascript" src="js/jquery.validate.min.js"></script>
    <script type="text/javascript" src="js/json2.js"></script>
    <script type="text/javascript" src="js/main.js"></script>
    <script type="text/javascript">

    $.validator.setDefaults({
        submitHandler: email_submit
    });

    $(function(){
        loadLeftPane("build");
        loadHeader();

        $(".package-table").css({
            'border': '1px solid #cccccc',
            'width': '100%'
        });

        $(".package-table td").css({
            'border': '1px solid #cccccc',
            'background-color': '#efefef',
            'padding': '.3%'
        });

        $('#tabs').tabs();

        $('#core-tab').click(function(){
            var selected = $('#tabs').tabs('option', 'selected');
            $('#tabs').tabs('select', selected+1);
        });

        $('#pkg-tab').click(function(){
            var msg = "<p>";
            var link = "http://sourceforge.net/projects/labb/files/iso/";
            var app = "";
            var version = "0.1.1";
            var base_os = "";
            var arch = "";
            var rootfs = "";
            var ext = "";

            if ( $("input[name='base-app']:checked").val() === "base-app" ) {
                msg = msg + "<b>Appliance:</b> Base";
                app = "base";
            }
            else if ( $("input[name='custom-app']:checked").val() === "custom-app" ) {
                msg = msg + "<b>Appliance:</b> Custom";
                app = "custom";
            }
            else {
                msg = msg + "<b>Appliance:</b> Core";
                app = "core";
            }

            if ( $("input[name='base_os']:checked").val() === "fc10" ) {
                msg = msg + "<p><b>Base OS:</b> Fedora Core 10</p>";
                base_os = "fc10";
            }
            else if ( $("input[name='base_os']:checked").val() === "centos54" ) {
                msg = msg + "<p><b>Base OS:</b> CentOS 5.4</p>";
                base_os = "centos54";
            }

            if ( $("input[name='arch']:checked").val() === "32bit" ) {
                msg = msg + "<p><b>Architecture:</b> i386 (32-bits)</p>";
                arch = "i386";
            }
            else if ( $("input[name='arch']:checked").val() === "64bit" ) {
                msg = msg + "<p><b>Architecture:</b> x86_64 (64-bits)</p>";
                arch = "x86_64";
            }

            if ( $("input[name='rootfs']:checked").val() === "bb_fs" ) {
                msg += "<p><b>Root Filesystem:</b> Busybox based</p>";
                rootfs = "bb";
            }
            else if ( $("input[name='rootfs']:checked").val() === "rpm_fs" ) {
                msg += "<p><b>Root Filesystem:</b> RPM based</p>";
                rootfs = "rpm";
            }

            if ( $("input[name='install']:checked").val() === "net" ) {
                msg += "<p><b>Install Media:</b> Netboot</p>";
                ext = "tgz";
            }
            else if ( $("input[name='install']:checked").val() === "iso" ) {
                msg += "<p><b>Install Media:</b> ISO image</p>";
                ext = "iso";
            }
            else if ( $("input[name='install']:checked").val() === "usb" ) {
                msg += "<p><b>Install Media:</b> USB</p>";
                ext = "tgz";
            }


            msg += "</p>";
            //https://sourceforge.net/projects/labb/files/iso/fc10/x86_64/lab-base-rpm-0.1.0.x86_64.fc10.iso/download
            link = link + base_os + '/' + arch + '/lab-' + app + '-' + rootfs + '-' + version + '.' + arch + '.' + base_os + '.live.' + ext
            msg += "<input type='button' value='Download' style='padding: 5%; cursor: pointer; width: 100%;' onclick=\"location.href='" + link + "';\"/>";
            $("#dlinfo").html(msg);
            var selected = $('#tabs').tabs('option', 'selected');
            $('#tabs').tabs('select', selected+1);
        });

        $("#dlForm").validate({
            rules: {
                email: {
                    required: true,
                    email: true
                },
            },
            messages: {
                email: "<br>Please enter a valid email address"
            }
        });

    });

    function email_submit() {
        var app = new Object();
        app.base_os = $("input[name='base_os']:checked").val();
        app.arch = $("input[name='arch']:checked").val();
        app.rootfs = $("input[name='rootfs']:checked").val();
        app.install = $("input[name='install']:checked").val();
        if ( $("input[name='base-app']:checked").val() === "base-app" ) {
            app.apptype = "base";
        }
        else if ( $("input[name='custom-app']:checked").val() === "custom-app" ) {
            app.apptype = "custom";
        }
        else {
            app.apptype = "core";
        }
        app.email = $("input[name='email']").val();
        $("input[name='submit']").val("Submitting ...");

        $.ajax({
            type: "GET",
            url: "/dl",
            data: app,
            async: false,
            success: function(msg){
                $("#dlpage").html(" \
                    <div class='ui-state-highlight' style='padding: 3%';> \
                    Thank you for submitting your build request. We will send you the download link soon \
                    </div>");
            },
            failure: function(msg){
                $("#dlpage").html(" \
                    <div class='ui-state-highlight' style='padding: 3%';> \
                    Your build request could not be submitted. \
                    </div>");
            }
        });
    }
    </script>

    <style type="text/css">
    </style>    
</head>

<body>
    <div id="header">
    </div>

    <div id="content">

    <div id="leftPane">
    </div>

    <div id="rightPane">
    <div id="tabs" style="font-size: 75%;">
        <ul>
            <li><a href="#base_system">Core System</a></li>
            <li><a href="#packages">Packages</a></li>
            <li><a href="#dlpage">Download</a></li>
        </ul>

        <div id="base_system" style="padding: 2%;">
            <div class="" style="width: 55%; float: left; margin-bottom: 4%;">
                <h4>Base Distribution</h4>
                <!-- <input type="radio" value="centos54" name="base_os" disabled>&nbsp;CentOS 5.4</input> -->
                <input type="radio" value="fc10" name="base_os" checked>&nbsp;Fedora Core 10</input>
                <h4>Select the architecture for the appliance</h4>
                <input type="radio" value="64bit" name="arch" checked>&nbsp;x86_64 (64-bits)</input>
                <input type="radio" value="32bit" name="arch">&nbsp;i386 (32-bits)</input>
                <h4>Root Filesystem</h4>
                <span style="display: none;"><input type="radio" value="bb_fs" name="rootfs">&nbsp;Busybox Based</input></span>
                <input type="radio" value="rpm_fs" name="rootfs" checked>&nbsp;RPM-Based</input>
                <h4>Install media</h4>
                <input type="radio" value="iso" name="install" checked>&nbsp;ISO image</input>
                <span style="display: none;">
                <input type="radio" value="usb" name="install">&nbsp;USB drive</input>
                <input type="radio" value="net" name="install">&nbsp;Netboot</input>
                </span>
                <p>
                    <input type="button" id="core-tab" value="Next"/>
                </p>
            </div>

            <div id="desc" class="ui-state-highlight" style="padding: 2%; float: left; width: 40%;">
                <p>
                The Core Appliance provides a bare minimum linux system enough to get to the root prompt with
                SSH access
                </p>
                <h4>Base Distributions</h4>
                Selects the base distribution on which the root filesystem and all the packages are built.
                This makes it easier for users to build new custom packages to load on the Core Appliance.
                <h4>Architecture</h4>
                Select a 64-bit or 32-bit package based on your server architecture.
                <h4>Root Filesystem</h4>
                Contains all the necessary files to get the system booted up to the root prompt. Busybox creates
                a much smaller although restrictive filesystem. If disk and memory is not a limitation we recommend
                you use the RPM-based root filesystem.
                <h4>Install Media</h4>
                Please choose the method you will use to boot the system. 
            </div>
            <div style="clear: both;">
            </div>

        </div>

        <div id="packages" style="margin: 1%;">
            <h4>Select the packages that you would like to add on to the Core appliance.</h4>
            <div class="ui-widget-content" style="padding: 0 2% 2% 2%;">
                <h3><input type="checkbox" value="base-app" name="base-app">&nbsp;Base Appliance</input></h3>
                <p>Adds a complete monitoring system using the following packages on top of the Core Appliance.</p>
                <table class="package-table">
                <tbody>
                <tr> <td>Lighttpd 1.4.25</td> <td>Collectd 4.9.0</td> <td>RRDTool 1.4.2</td> <td>PHP 5.3.1</td> </tr>
                </tbody>
                </table>
            </div>
            <br>
            <div class="ui-widget-content" style="padding: 0 2% 2% 2%;">
                <h3><input type="checkbox" value="custom-app" name="custom-app" disabled>&nbsp;Custom Appliance</input></h3>
                <p>We are working on adding custom packages on top of the Core or Base Appliance.</p>
                <table class="package-table">
                </table>
            </div>
            <br>
            <div style="clear: both;">
                <input type="button" id="pkg-tab" value="Next"/>
            </div>
        </div>

        <div id="dlpage" style="padding: 2%;">
            <h3>Selected Options</h3>
            <div id="dlinfo" class="ui-state-highlight" style="padding: 2%; float: left;">
                <p>Please select the type of system you want to build on the Core System tab.</p>
            </div>
            
            <!-- Not used yet -->
            <div class="ui-state-highlight" style="padding: 2%; margin-left: 2%; float: left; width: 40%; display: none;">
            <form class="" id="dlForm" method="get" action="">
                <p>
                Due to length of the build process for creating custom appliance, we request that you 
                enter your email address and we will send you a download link once the build is done. Usually within a few minutes.
                </p>
               <p>
                 <label for="cemail">Email</label>
                 <input id="cemail" name="email" size="25"  class="required email" />
               </p>
               <p>
                 <input name="submit" type="submit" value="Submit"/>
               </p>
            </form>
            </div>
            <div style="clear: both;">
            </div>

            <!-- 
            <a class="ui-widget-header" style="padding: 1%; text-decoration: none;" id="dllink" href="http://www.google.com"> Download </a>
            -->
        </div>

    </div>
    </div>

    </div>

    <div id="footer">
    </div>

</body>
</html>
